
/** Add css rules here for your application. */
root { 
    display: block;
}
body{
    font-family: tahoma, arial, sans-serif;
    font-weight: normal;
    font-size: 0.85em;
    background-color: #9ECDE1;
}
.aqua-button{
    width: auto;
    height: 28px;
    padding: 5px 16px 3px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border: 2px solid #ccc;
    position: relative;

    /* Label */
    font-family: Lucida Sans, Helvetica, sans-serif;
    font-weight: 800;
    color: #fff;
    text-shadow: rgba(10, 10, 10, 0.5) 1px 2px 2px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis; 
    overflow: hidden;
}

.aqua{
    background-color: rgba(60, 132, 198, 0.8);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(28, 91, 155, 0.8)), to(rgba(108, 191, 255, .9)));
    border-top-color: #8ba2c1;
    border-right-color: #5890bf;
    border-bottom-color: #4f93ca;
    border-left-color: #768fa5;	
    -webkit-box-shadow: rgba(66, 140, 240, 0.5) 0px 10px 16px;
    -moz-box-shadow: rgba(66, 140, 240, 0.5) 0px 10px 16px; /* FF 3.5+ */
}

.glare {
    position: absolute;
    top: 0;
    left: 5px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    height: 1px;
    width: 142px;
    padding: 8px 0;
    background-color: rgba(255, 255, 255, 0.25);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 95%, from(rgba(255, 255, 255, 0.7)), to(rgba(255, 255, 255, 0)));
}


/* Gradient 1 */
.text-box {
    width: auto;
    height: auto;
    min-width: 100px;
    min-height: 21px;
    padding-left: 2px;
    padding-right: 2px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border: 1px solid #ccc;
    position: relative;

    /* Label */
    font-family: tahoma, arial, sans-serif;
    color: #333;
    text-align: justify;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis; 
    overflow: hidden;
}
.text-aqua{
    background-color: rgba(210, 243, 252, 0.8);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(108, 191, 255, 0.8)), to(rgba(210, 243, 252, .9)));
    border-top-color: #8ba2c1;
    border-right-color: #5890bf;
    border-bottom-color: #4f93ca;
    border-left-color: #768fa5;	
    -webkit-box-shadow: rgba(66, 140, 240, 0.5) 0px 10px 16px;
    -moz-box-shadow: rgba(66, 140, 240, 0.5) 0px 10px 16px; /* FF 3.5+ */
}

#login-wrapper{
    width: 350px;
    height: 180px;
    margin: 0 auto;
    
    padding: 10px;
    -moz-box-shadow: 10px 10px 5px #888;
    -webkit-box-shadow: 10px 10px 5px #888;
    box-shadow: 10px 10px 5px #888;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    /* fallback */
    background-color: #68BAE2;
    background-position: center center;
    background-repeat: no-repeat;

    /* Safari 4-5, Chrome 1-9 */
    /* Can't specify a percentage size? Laaaaaame. */
    background: -webkit-gradient(radial, center center, 0, center center, 460, from(#D2F3FC), to(#68BAE2));

    /* Safari 5.1+, Chrome 10+ */
    background: -webkit-radial-gradient(circle, #D2F3FC, #68BAE2);

    /* Firefox 3.6+ */
    background: -moz-radial-gradient(circle, #D2F3FC, #68BAE2);

    /* IE 10 */
    background: -ms-radial-gradient(circle, #D2F3FC, #68BAE2);

    /* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) */
}

#register-wrapper{
    width: 350px;
    height: 380px;
    margin: 0 auto;
    
    padding: 10px;
    -moz-box-shadow: 10px 10px 5px #888;
    -webkit-box-shadow: 10px 10px 5px #888;
    box-shadow: 10px 10px 5px #888;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    /* fallback */
    background-color: #68BAE2;
    background-position: center center;
    background-repeat: no-repeat;

    /* Safari 4-5, Chrome 1-9 */
    /* Can't specify a percentage size? Laaaaaame. */
    background: -webkit-gradient(radial, center center, 0, center center, 460, from(#D2F3FC), to(#68BAE2));

    /* Safari 5.1+, Chrome 10+ */
    background: -webkit-radial-gradient(circle, #D2F3FC, #68BAE2);

    /* Firefox 3.6+ */
    background: -moz-radial-gradient(circle, #D2F3FC, #68BAE2);

    /* IE 10 */
    background: -ms-radial-gradient(circle, #D2F3FC, #68BAE2);

    /* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) */
}

#linearBg1 {
    /* fallback */
    background-color: #1a82f7;
    background-repeat: repeat-y;

    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, left top, right top, from(#1a82f7), to(#2F2727));

    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(left, #2F2727, #1a82f7);

    /* Firefox 3.6+ */
    background: -moz-linear-gradient(left, #2F2727, #1a82f7);

    /* IE 10 */
    background: -ms-linear-gradient(left, #2F2727, #1a82f7);

    /* Opera 11.10+ */
    background: -o-linear-gradient(left, #2F2727, #1a82f7);
}

#radial-position {
    /* fallback */
    background-color: #2F2727;
    background-image: url(images/radial_fancy.png);
    background-position: 80% 20%;
    background-repeat: no-repeat;

    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(radial, 80% 20%, 0, 80% 40%, 100, from(#1a82f7), to(#2F2727));

    /* Safari 5.1+, Chrome 10+ */
    background: -webkit-radial-gradient(80% 20%, closest-corner, #1a82f7, #2F2727);

    /* Firefox 3.6+ */
    background: -moz-radial-gradient(80% 20%, closest-corner, #1a82f7, #2F2727);

    /* IE 10 */
    background: -ms-radial-gradient(80% 20%, closest-corner, #1a82f7, #2F2727);

    /* Opera cannot do radial gradients yet */
}

#linearBg2 {
    /* fallback */
    background-color: #1a82f7;
    background: url(images/linear_bg_2.png);
    background-repeat: repeat-x;

    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));

    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(top, #2F2727, #1a82f7);

    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, #2F2727, #1a82f7);

    /* IE 10 */
    background: -ms-linear-gradient(top, #2F2727, #1a82f7);

    /* Opera 11.10+ */
    background: -o-linear-gradient(top, #2F2727, #1a82f7);
}


#radial-center {
    /* fallback */
    background-color: #68BAE2;
    background-position: center center;
    background-repeat: no-repeat;

    /* Safari 4-5, Chrome 1-9 */
    /* Can't specify a percentage size? Laaaaaame. */
    background: -webkit-gradient(radial, center center, 0, center center, 460, from(#1a82f7), to(#2F2727));

    /* Safari 5.1+, Chrome 10+ */
    background: -webkit-radial-gradient(circle, #1a82f7, #2F2727);

    /* Firefox 3.6+ */
    background: -moz-radial-gradient(circle, #1a82f7, #2F2727);

    /* IE 10 */
    background: -ms-radial-gradient(circle, #1a82f7, #2F2727);

    /* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) */
}

.errorblock {
	color: #ff0000;
	background-color: #ffEEEE;
	border: 3px solid #ff0000;
	padding: 8px;
	margin: 16px;
}


.blueButton {
	-moz-box-shadow: inset 0px 1px 0px 0px #cae3fc;
	-webkit-box-shadow: inset 0px 1px 0px 0px #cae3fc;
	box-shadow: inset 0px 1px 0px 0px #cae3fc;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #79bbff
		), color-stop(1, #4197ee) );
	background: -moz-linear-gradient(center top, #79bbff 5%, #4197ee 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#79bbff', endColorstr = '#4197ee' );
	background-color: #79bbff;
	border: 1px solid #469df5;
	display: inline-block;
	color: #ffffff;
	font-family: Trebuchet MS;
	font-size: 14px;
	font-weight: normal;
	padding: 2px 17px;
	text-decoration: none;
	text-shadow: 1px 1px 0px #287ace;
	cursor: pointer;
}

.blueButton:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #4197ee
		), color-stop(1, #79bbff) );
	background: -moz-linear-gradient(center top, #4197ee 5%, #79bbff 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#4197ee', endColorstr = '#79bbff' );
	background-color: #4197ee;
}

.blueButton:active {
	position: relative;
	top: 1px;
}

.greenButton {
	-moz-box-shadow: inset 0px 1px 0px 0px #caefab;
	-webkit-box-shadow: inset 0px 1px 0px 0px #caefab;
	box-shadow: inset 0px 1px 0px 0px #caefab;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77d42a
		), color-stop(1, #5cb811) );
	background: -moz-linear-gradient(center top, #77d42a 5%, #5cb811 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#77d42a', endColorstr = '#5cb811' );
	background-color: #77d42a;
	border: 1px solid #268a16;
	display: inline-block;
	color: #000000;
	font-family: Trebuchet MS;
	font-size: 14px;
	font-weight: normal;
	padding: 2px 17px;
	text-decoration: none;
	text-shadow: 1px 1px 0px #aade7c;
	cursor: pointer;
}

.greenButton:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cb811
		), color-stop(1, #77d42a) );
	background: -moz-linear-gradient(center top, #5cb811 5%, #77d42a 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#5cb811', endColorstr = '#77d42a' );
	background-color: #5cb811;
}

.greenButton:active {
	position: relative;
	top: 1px;
}

.yellowButton {
	-moz-box-shadow: inset 0px 1px 0px 0px #fed897;
	-webkit-box-shadow: inset 0px 1px 0px 0px #fed897;
	box-shadow: inset 0px 1px 0px 0px #fed897;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6b33d
		), color-stop(1, #d29105) );
	background: -moz-linear-gradient(center top, #f6b33d 5%, #d29105 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#f6b33d', endColorstr = '#d29105' );
	background-color: #f6b33d;
	border: 1px solid #eda933;
	display: inline-block;
	color: #ffffff;
	font-family: Trebuchet MS;
	font-size: 14px;
	font-weight: normal;
	padding: 2px 17px;
	text-decoration: none;
	text-shadow: 1px 1px 0px #cd8a15;
	cursor: pointer;
}

.yellowButton:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d29105
		), color-stop(1, #f6b33d) );
	background: -moz-linear-gradient(center top, #d29105 5%, #f6b33d 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#d29105', endColorstr = '#f6b33d' );
	background-color: #d29105;
}

.yellowButton:active {
	position: relative;
	top: 1px;
}

.whiteButton {
	-moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
	box-shadow: inset 0px 1px 0px 0px #ffffff;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9
		), color-stop(1, #e9e9e9) );
	background: -moz-linear-gradient(center top, #f9f9f9 5%, #e9e9e9 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#f9f9f9', endColorstr = '#e9e9e9' );
	background-color: #f9f9f9;
	border: 1px solid #dcdcdc;
	display: inline-block;
	color: #666666;
	font-family: Trebuchet MS;
	font-size: 14px;
	font-weight: normal;
	padding: 2px 17px;
	text-decoration: none;
	text-shadow: 1px 1px 0px #ffffff;
	cursor: pointer;
}

.whiteButton:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9
		), color-stop(1, #f9f9f9) );
	background: -moz-linear-gradient(center top, #e9e9e9 5%, #f9f9f9 100%);
	filter: progid : DXImageTransform.Microsoft.gradient ( startColorstr =
		'#e9e9e9', endColorstr = '#f9f9f9' );
	background-color: #e9e9e9;
}

.whiteButton:active {
	position: relative;
	top: 1px;
}

.logoutLink {
	color: white;
}

.image-padding {
	padding-top: 3px;
}

/** Example rules used by the template application (remove for your app) */
h1 {
  font-size: 2em;
  font-weight: bold;
  color: #777777;
  margin: 40px 0px 70px;
  text-align: center;
}

.sendButton {
  display: block;
  font-size: 16pt;
}

/** Most GWT widgets already have a style name defined */
.gwt-DialogBox {
  width: 400px;
}

.dialogVPanel {
  margin: 5px;
}

.serverResponseLabelError {
  color: red;
}

/** Set ids using widget.getElement().setId("idOfElement") */
#closeButton {
  margin: 15px 6px 6px;
}


/** Custom styles */
.userNameLabel{
	color: black;
	font-weight: bold;
	text-decoration: underline;
}

.interactImageHover {
    font-size:11px;
    border:1px solid #808080;
    padding:5px;
    background-color:#b8d0ff;
    color:black;
}


.mainLayout{
	background-color: white;
}

.toolbar-title{
	color: #136E13;
	font-size: 1.4em;
	font-weight: bold;
}

.header-text{
	font-family: tahoma, arial, sans-serif;
    color: #fff;
}